<template>
  <w-view>
    <layout-property :w="w" />
  </w-view>
</template>

<script>
  import $ from 'dfish-widget'

  export default {
    data() {
      return {
        hasCommon: true,
        isW: true,
        isFunction: false,
        deprecate: '',
        picks: [],
        extends: [],
        attrs: [],
        events: [],
        methods: [],
        slots: [],
        computed: [],
        examples: [],
        css: [],
      }
    },
    created() {
      this.extends.forEach(a => {
        $.lodash.forOwn(a, (b, c) => {
          this.merge(b, c, true)
        })
      })
      this.picks.forEach(a => {
        a[1].split(',').forEach(b => {
          let r = a[0].attrs.find(c => c.name == b)
          r && this.attrs.push(r)
        })
      })
    },
    methods: {
      arrange() {
        if (this.deprecate) {
          this.attrs = this.attrs.filter(v => !$.idsAny(this.deprecate, v.name))
          this.events = this.events.filter(v => !$.idsAny(this.deprecate, v.name))
          this.methods = this.methods.filter(v => !$.idsAny(this.deprecate, v.name))
        }
        this.attrs.sort((m, n) => {
         return m.name < n.name ? -1 : 1
        })
        this.events.sort((m, n) => {
          return m.name < n.name ? -1 : 1
        })
        return this
      },
      merge(a, b, c) {
        let r = this[b]
        a.forEach(v => {
          let i = r.findIndex(n => n.name == v.name)
          if (i > -1) r[i] = c ? {...v, ...r[i]} : {...r[i], ...v}
          else r.push(v)
        })
      },
    },
    computed: {
      w() {
        return this.arrange()
      }
    }
  }
</script>

